{
 "cells": [
  {
   "cell_type": "code",
   "execution_count": 13,
   "id": "85d24bce",
   "metadata": {},
   "outputs": [],
   "source": [
    "from pyecharts import options as opts\n",
    "from pyecharts.charts import Grid, Line, Scatter\n",
    "\n",
    "from pyecharts.faker import Faker"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": 24,
   "id": "7584428d",
   "metadata": {},
   "outputs": [
    {
     "data": {
      "text/html": [
       "\n",
       "<script>\n",
       "    require.config({\n",
       "        paths: {\n",
       "            'echarts':'https://assets.pyecharts.org/assets/echarts.min'\n",
       "        }\n",
       "    });\n",
       "</script>\n",
       "\n",
       "        <div id=\"0fcd1253c68a452bbe78f18d6c51bf35\" style=\"width:900px; height:500px;\"></div>\n",
       "\n",
       "<script>\n",
       "        require(['echarts'], function(echarts) {\n",
       "                var chart_0fcd1253c68a452bbe78f18d6c51bf35 = echarts.init(\n",
       "                    document.getElementById('0fcd1253c68a452bbe78f18d6c51bf35'), 'white', {renderer: 'canvas'});\n",
       "                var option_0fcd1253c68a452bbe78f18d6c51bf35 = {\n",
       "    \"animation\": true,\n",
       "    \"animationThreshold\": 2000,\n",
       "    \"animationDuration\": 1000,\n",
       "    \"animationEasing\": \"cubicOut\",\n",
       "    \"animationDelay\": 0,\n",
       "    \"animationDurationUpdate\": 300,\n",
       "    \"animationEasingUpdate\": \"cubicOut\",\n",
       "    \"animationDelayUpdate\": 0,\n",
       "    \"color\": [\n",
       "        \"#c23531\",\n",
       "        \"#2f4554\",\n",
       "        \"#61a0a8\",\n",
       "        \"#d48265\",\n",
       "        \"#749f83\",\n",
       "        \"#ca8622\",\n",
       "        \"#bda29a\",\n",
       "        \"#6e7074\",\n",
       "        \"#546570\",\n",
       "        \"#c4ccd3\",\n",
       "        \"#f05b72\",\n",
       "        \"#ef5b9c\",\n",
       "        \"#f47920\",\n",
       "        \"#905a3d\",\n",
       "        \"#fab27b\",\n",
       "        \"#2a5caa\",\n",
       "        \"#444693\",\n",
       "        \"#726930\",\n",
       "        \"#b2d235\",\n",
       "        \"#6d8346\",\n",
       "        \"#ac6767\",\n",
       "        \"#1d953f\",\n",
       "        \"#6950a1\",\n",
       "        \"#918597\"\n",
       "    ],\n",
       "    \"series\": [\n",
       "        {\n",
       "            \"type\": \"line\",\n",
       "            \"name\": \"A\",\n",
       "            \"connectNulls\": false,\n",
       "            \"xAxisIndex\": 0,\n",
       "            \"yAxisIndex\": 0,\n",
       "            \"symbolSize\": 4,\n",
       "            \"showSymbol\": true,\n",
       "            \"smooth\": false,\n",
       "            \"clip\": true,\n",
       "            \"step\": false,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"\\u8349\\u8393\",\n",
       "                    136\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8292\\u679c\",\n",
       "                    104\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8461\\u8404\",\n",
       "                    55\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u96ea\\u68a8\",\n",
       "                    36\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u897f\\u74dc\",\n",
       "                    77\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u67e0\\u6aac\",\n",
       "                    47\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8f66\\u5398\\u5b50\",\n",
       "                    129\n",
       "                ]\n",
       "            ],\n",
       "            \"hoverAnimation\": true,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"lineStyle\": {\n",
       "                \"show\": true,\n",
       "                \"width\": 1,\n",
       "                \"opacity\": 1,\n",
       "                \"curveness\": 0,\n",
       "                \"type\": \"solid\"\n",
       "            },\n",
       "            \"areaStyle\": {\n",
       "                \"opacity\": 0\n",
       "            },\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 0\n",
       "        },\n",
       "        {\n",
       "            \"type\": \"line\",\n",
       "            \"name\": \"B\",\n",
       "            \"connectNulls\": false,\n",
       "            \"xAxisIndex\": 0,\n",
       "            \"yAxisIndex\": 0,\n",
       "            \"symbolSize\": 4,\n",
       "            \"showSymbol\": true,\n",
       "            \"smooth\": false,\n",
       "            \"clip\": true,\n",
       "            \"step\": false,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"\\u8349\\u8393\",\n",
       "                    76\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8292\\u679c\",\n",
       "                    141\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8461\\u8404\",\n",
       "                    41\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u96ea\\u68a8\",\n",
       "                    143\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u897f\\u74dc\",\n",
       "                    95\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u67e0\\u6aac\",\n",
       "                    57\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u8f66\\u5398\\u5b50\",\n",
       "                    96\n",
       "                ]\n",
       "            ],\n",
       "            \"hoverAnimation\": true,\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"top\",\n",
       "                \"margin\": 8\n",
       "            },\n",
       "            \"lineStyle\": {\n",
       "                \"show\": true,\n",
       "                \"width\": 1,\n",
       "                \"opacity\": 1,\n",
       "                \"curveness\": 0,\n",
       "                \"type\": \"solid\"\n",
       "            },\n",
       "            \"areaStyle\": {\n",
       "                \"opacity\": 0\n",
       "            },\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 0\n",
       "        },\n",
       "        {\n",
       "            \"type\": \"scatter\",\n",
       "            \"name\": \"C\",\n",
       "            \"xAxisIndex\": 1,\n",
       "            \"yAxisIndex\": 1,\n",
       "            \"symbolSize\": 10,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"\\u886c\\u886b\",\n",
       "                    37\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u6bdb\\u8863\",\n",
       "                    81\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u9886\\u5e26\",\n",
       "                    65\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u88e4\\u5b50\",\n",
       "                    61\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u98ce\\u8863\",\n",
       "                    58\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u9ad8\\u8ddf\\u978b\",\n",
       "                    20\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u889c\\u5b50\",\n",
       "                    42\n",
       "                ]\n",
       "            ],\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"right\",\n",
       "                \"margin\": 8\n",
       "            }\n",
       "        },\n",
       "        {\n",
       "            \"type\": \"scatter\",\n",
       "            \"name\": \"D\",\n",
       "            \"xAxisIndex\": 1,\n",
       "            \"yAxisIndex\": 1,\n",
       "            \"symbolSize\": 10,\n",
       "            \"data\": [\n",
       "                [\n",
       "                    \"\\u886c\\u886b\",\n",
       "                    86\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u6bdb\\u8863\",\n",
       "                    25\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u9886\\u5e26\",\n",
       "                    124\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u88e4\\u5b50\",\n",
       "                    44\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u98ce\\u8863\",\n",
       "                    84\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u9ad8\\u8ddf\\u978b\",\n",
       "                    105\n",
       "                ],\n",
       "                [\n",
       "                    \"\\u889c\\u5b50\",\n",
       "                    52\n",
       "                ]\n",
       "            ],\n",
       "            \"label\": {\n",
       "                \"show\": true,\n",
       "                \"position\": \"right\",\n",
       "                \"margin\": 8\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"legend\": [\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"A\",\n",
       "                \"B\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"A\": true,\n",
       "                \"B\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"left\": \"20%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        },\n",
       "        {\n",
       "            \"data\": [\n",
       "                \"C\",\n",
       "                \"D\"\n",
       "            ],\n",
       "            \"selected\": {\n",
       "                \"C\": true,\n",
       "                \"D\": true\n",
       "            },\n",
       "            \"show\": true,\n",
       "            \"right\": \"20%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10,\n",
       "            \"itemWidth\": 25,\n",
       "            \"itemHeight\": 14\n",
       "        }\n",
       "    ],\n",
       "    \"tooltip\": {\n",
       "        \"show\": true,\n",
       "        \"trigger\": \"item\",\n",
       "        \"triggerOn\": \"mousemove|click\",\n",
       "        \"axisPointer\": {\n",
       "            \"type\": \"line\"\n",
       "        },\n",
       "        \"showContent\": true,\n",
       "        \"alwaysShowContent\": false,\n",
       "        \"showDelay\": 0,\n",
       "        \"hideDelay\": 100,\n",
       "        \"textStyle\": {\n",
       "            \"fontSize\": 14\n",
       "        },\n",
       "        \"borderWidth\": 0,\n",
       "        \"padding\": 5\n",
       "    },\n",
       "    \"xAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"\\u8349\\u8393\",\n",
       "                \"\\u8292\\u679c\",\n",
       "                \"\\u8461\\u8404\",\n",
       "                \"\\u96ea\\u68a8\",\n",
       "                \"\\u897f\\u74dc\",\n",
       "                \"\\u67e0\\u6aac\",\n",
       "                \"\\u8f66\\u5398\\u5b50\"\n",
       "            ]\n",
       "        },\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 1,\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            },\n",
       "            \"data\": [\n",
       "                \"\\u886c\\u886b\",\n",
       "                \"\\u6bdb\\u8863\",\n",
       "                \"\\u9886\\u5e26\",\n",
       "                \"\\u88e4\\u5b50\",\n",
       "                \"\\u98ce\\u8863\",\n",
       "                \"\\u9ad8\\u8ddf\\u978b\",\n",
       "                \"\\u889c\\u5b50\"\n",
       "            ]\n",
       "        }\n",
       "    ],\n",
       "    \"yAxis\": [\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 0,\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            }\n",
       "        },\n",
       "        {\n",
       "            \"show\": true,\n",
       "            \"scale\": false,\n",
       "            \"nameLocation\": \"end\",\n",
       "            \"nameGap\": 15,\n",
       "            \"gridIndex\": 1,\n",
       "            \"inverse\": false,\n",
       "            \"offset\": 0,\n",
       "            \"splitNumber\": 5,\n",
       "            \"minInterval\": 0,\n",
       "            \"splitLine\": {\n",
       "                \"show\": false,\n",
       "                \"lineStyle\": {\n",
       "                    \"show\": true,\n",
       "                    \"width\": 1,\n",
       "                    \"opacity\": 1,\n",
       "                    \"curveness\": 0,\n",
       "                    \"type\": \"solid\"\n",
       "                }\n",
       "            }\n",
       "        }\n",
       "    ],\n",
       "    \"title\": [\n",
       "        {\n",
       "            \"text\": \"\\u6298\\u7ebf\\u56fe\",\n",
       "            \"left\": \"5%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        },\n",
       "        {\n",
       "            \"text\": \"\\u6563\\u70b9\\u56fe\",\n",
       "            \"right\": \"40%\",\n",
       "            \"padding\": 5,\n",
       "            \"itemGap\": 10\n",
       "        }\n",
       "    ],\n",
       "    \"grid\": [\n",
       "        {\n",
       "            \"show\": false,\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 2,\n",
       "            \"right\": \"55%\",\n",
       "            \"containLabel\": false,\n",
       "            \"backgroundColor\": \"transparent\",\n",
       "            \"borderColor\": \"#ccc\",\n",
       "            \"borderWidth\": 1\n",
       "        },\n",
       "        {\n",
       "            \"show\": false,\n",
       "            \"zlevel\": 0,\n",
       "            \"z\": 2,\n",
       "            \"left\": \"55%\",\n",
       "            \"containLabel\": false,\n",
       "            \"backgroundColor\": \"transparent\",\n",
       "            \"borderColor\": \"#ccc\",\n",
       "            \"borderWidth\": 1\n",
       "        }\n",
       "    ]\n",
       "};\n",
       "                chart_0fcd1253c68a452bbe78f18d6c51bf35.setOption(option_0fcd1253c68a452bbe78f18d6c51bf35);\n",
       "        });\n",
       "    </script>\n"
      ],
      "text/plain": [
       "<pyecharts.render.display.HTML at 0x22051aa4160>"
      ]
     },
     "execution_count": 24,
     "metadata": {},
     "output_type": "execute_result"
    }
   ],
   "source": [
    "# 折线图\n",
    "line = (\n",
    "    Line()\n",
    "    .add_xaxis(Faker.choose())\n",
    "    .add_yaxis('A', Faker.values())\n",
    "    .add_yaxis('B', Faker.values())\n",
    "    .set_global_opts(\n",
    "        title_opts=opts.TitleOpts(title='折线图', pos_left='5%'),\n",
    "        legend_opts=opts.LegendOpts(pos_left='20%')\n",
    "    )\n",
    ")\n",
    "# line.render_notebook()\n",
    "\n",
    "# 散点图\n",
    "scatter = (\n",
    "    Scatter()\n",
    "    .add_xaxis(Faker.choose())\n",
    "    .add_yaxis('C', Faker.values())\n",
    "    .add_yaxis('D', Faker.values())\n",
    "    .set_global_opts(\n",
    "        title_opts=opts.TitleOpts(title='散点图', pos_right='40%'),\n",
    "        legend_opts=opts.LegendOpts(pos_right='20%')\n",
    "    )\n",
    ")\n",
    "\n",
    "# 多图布局\n",
    "grid = (\n",
    "    Grid()\n",
    "    .add(line, grid_opts=opts.GridOpts(pos_right=\"55%\"))\n",
    "    .add(scatter, grid_opts=opts.GridOpts(pos_left=\"55%\"))\n",
    "\n",
    ")\n",
    "grid.render_notebook()"
   ]
  },
  {
   "cell_type": "code",
   "execution_count": null,
   "id": "07780813",
   "metadata": {},
   "outputs": [],
   "source": []
  }
 ],
 "metadata": {
  "kernelspec": {
   "display_name": "Python 3 (ipykernel)",
   "language": "python",
   "name": "python3"
  },
  "language_info": {
   "codemirror_mode": {
    "name": "ipython",
    "version": 3
   },
   "file_extension": ".py",
   "mimetype": "text/x-python",
   "name": "python",
   "nbconvert_exporter": "python",
   "pygments_lexer": "ipython3",
   "version": "3.9.13"
  }
 },
 "nbformat": 4,
 "nbformat_minor": 5
}
